// 权限控制
import router from '@/router'
// import { getToken } from './utils/auth'
import store from './store'
// import { getProfileAPI } from './api/user'

// 导入原始动态路由表
import { asyncRoutes } from './router/asyncRouter'

const WHITE_LIST = ['/login', '/404']

// 处理一级路由权限数据
function getFirstRoutePerms (permsArr) {
  const newArr = permsArr.map(item => {
    return item.split(':')[0]
  })
  // return [...new Set(newArr)]
  return Array.from(new Set(newArr))
}

// 处理二级路由权限数据
function getSecondRoutePerms (permsArr) {
  const newArr = permsArr.map(item => {
    const arr = item.split(':')
    return `${arr[0]}:${arr[1]}`
  })
  return [...new Set(newArr)]
}

// 根据权限标识过滤路由表
function getRoutes (firstRoutePerms, secondRoutePerms, asyncRoutes) {
  console.log(firstRoutePerms)
  if (firstRoutePerms.includes('*')) {
    // 管理员
    return asyncRoutes
  }
  // 根据一级和二级对动态路由表做过滤 return出去过滤之后的路由表
  // 1. 根据一级路由对动态路由表做过滤
  return asyncRoutes
    .filter(route => {
      return firstRoutePerms.includes(route.permission)
    })
    .map(item => {
      // 2. 对二级路由做过滤
      return {
        ...item,
        children: item.children.filter(item =>
          secondRoutePerms.includes(item.permission)
        )
      }
    })
}

router.beforeEach(async (to, from, next) => {
  // const token = getToken()
  const token = store.state.user.token
  // 有token
  if (token) {
    next()
    // const res = await getProfileAPI()
    // console.log(res)
    // 只有从来没有获取过权限数据 才执行后面的逻辑  store.state.user.userProfile.id
    if (!store.state.user.userProfile.id) {
      // 1、拿到用户的权限信息（要不要无所谓）
      const perms = await store.dispatch('menu/getUserPermission')
      // 1. 调用action函数获取用户权限数据
      const permision = await store.dispatch('user/getUserProfile')
      console.log('全部的权限标识', permision)
      // 2、根据权限标识 筛选出对应的一级路由标识
      const firstRoutePerms = getFirstRoutePerms(permision)
      console.log('一级的权限标识', firstRoutePerms)
      // 3、根据权限标识 筛选出对应的二级路由标识
      const secondRoutePerms = getSecondRoutePerms(permision)
      console.log('二级的权限标识', secondRoutePerms)
      // 4、根据一级权限标识、二级权限标识、动态路由进行筛选
      const filterRoutes = getRoutes(
        firstRoutePerms,
        secondRoutePerms,
        asyncRoutes
      )
      console.log('过滤后的权限标识', filterRoutes)
      // 5、把筛选后的路由 展示在左侧（router.addRoute提供动态路由页面跳转；vuex存储用于左侧菜单渲染）
      // 5.1、动态添加路由表核心思路：vue-router插件提供了 `addRoute` 方法可以把处理之后的路由添加到路由系统中，让路由生效
      filterRoutes.forEach(route => router.addRoute(route))
      // 5. 存入Vuex渲染左侧菜单
      store.commit('menu/setMenuList', filterRoutes)
    }
  } else {
    // 没有token
    if (WHITE_LIST.includes(to.path)) {
      next()
    } else {
      next('/login')
    }
  }
})
